<!DOCTYPE html>
<html>
<head>
	<title>用户详情 -- 小跳蛙快递驿站服务平台</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
	<link href="/backend/css/normalize.css" type="text/css" rel="stylesheet" />
	<link href="/backend/css/common.css" type="text/css" rel="stylesheet" />
	<script src="/backend/js/jquery.min.js" type="text/javascript"></script>
	<script src="/backend/js/notice.js" type="text/javascript"></script>
	<script src="/backend/js/common.js" type="text/javascript"></script>
	<script src="/backend/js/regexp.js" type="text/javascript"></script>
	<script src="/backend/layer/layer.js"></script>
	<style type="text/css">
		.userInfoEditCont{
			width: 100%;
		}
		.userInfoEditCont  .userInfoIcon{
			width: 20%;
			margin: 0px auto 10px;
		}
		.userInfoEditCont  .nickName{
			font-size: 14px;
			text-align: center;
			font-weight: bold;
		}

		/* -----  cover ----- */
		#coverCont{
			position: absolute;
			top: 0%;
			left: 0%;
			width: 100%;
			height: 100%;
			background-color: rgba(0,0,0,0.5);
			z-index: 1000;
			display: none;
		}
		.userTypeCont{
			position: absolute;
			top: 0px;
			left: 0px;
			z-index: 1001;
			width: 80%;
			background: #f4f4f4;
			border: 1px solid #f1f1f1;
			border-radius: 5px;
			padding: 20px 0px 30px;
			display: none;
		}
		.userTypeCont .userTypeTitle{
			text-align: center;
			font-size: 18px;
			font-weight: bold;
			padding: 10px 0px;
		}
		.userTypeCont .userType{
			width: 90%;
			margin: 5px auto;
			overflow: hidden;
		}
		.userTypeCont .userType .teacherType{
			width: 45%;
			padding: 10px 2%;
			float: left;
			border: 1px solid #f1f1f1;
			background: #fff;
		}
		.userTypeCont .userType .studentType{
			width: 45%;
			padding: 10px 2%;
			float: right;
			border: 1px solid #f1f1f1;
			background: #fff;
		}
		.userType .typeImg{
			width: 50%;
			margin: 0px auto 5px;
		}
		.userType .typeTitle{
			text-align: center;
			line-height: 30px;
			font-weight: bold;
			color: #333333;
		}
		.userType .typeDesc{
			font-size: 12px;
			color: #888888;
			line-height: 20px;
			text-align: center;
		}

		.submitBtn{
			width: 90%;
			margin: 0 auto 20px;
			text-align: center;
			line-height: 46px;
			border-radius: 23px;
			background: #888888;
			color: #fff;
			font-weight: bolder;
		}

		.userSelectCont{
			width: 100%;
			background: #fff;
			font-size: 14px;
			overflow: hidden;
			position: fixed;
			left: 0px;
			bottom: 0px;
			display: none;
			z-index: 999;
		}
		.userSelectCont .userSelectTitle{
			width: 90%;
			padding: 0px 5%;
			background: #fff;
			overflow: hidden;
			border-bottom: 1px solid #f1f1f1;
		}
		.userSelectCont .userSelectTitle .selectCancelBtn{
			float: left;
			color: #1f72ff;
			font-weight: bold;
			line-height: 35px;
		}
		.userSelectCont .userSelectTitle .selectOkBtn{
			float: right;
			color: #1f72ff;
			font-weight: bold;
			line-height: 35px;
		}
		.userSelectCont  .selectNumCont{
			width: 90%;
			padding: 0px 5%;
		}
		.userSelectCont  .selectNumCont .selectNum{
			overflow: hidden;
			padding: 10px 0px;
		}
		.userSelectCont  .selectNumCont .selectNum .selectTitle{
			float: left;
			width: 100px;
		}
		.userSelectCont  .selectNumCont .selectNum .selectNumDiv{
			float: left;
			width: calc(100% - 100px);
		}
		.userSelectCont  .selectNumCont .selectNum .selectNumDiv ul{
			list-style: none;
			margin: 0px;
			padding: 0px;
		}
		.userSelectCont  .selectNumCont .selectNum .selectNumDiv ul li{
			float: left;
			width: 24%;
			margin: 0px 0px 5px 1%;
			text-align: center;
			line-height: 25px;
		}

		.selectNum .selectNumDiv ul li.unselect{
			background: #f1f1f1;
			color: #000;
		}
		.selectNum .selectNumDiv ul li.select{
			background: #1f72ff;
			color: #fff;
		}

		.userNewPhoneDiv{
			display: none;
		}

		.gapText{
			text-align: center;
			font-size: 14px;
			color: #888888;
			margin-top: 10px;
		}
	</style>
</head>
<body>
<div class="content">
	<div class="headerNav">
		<div class="headerNavTop"><div class="headerNavIcon headerNavIconOut"><span></span><span></span></div></div>
		<div class="headerNavCont">
			<a href="../../front/view/index.html">快递首页</a>
			<a href="../../front/view/wxUserhome.html">个人中心</a>
			<a href="../../front/view/lazyboard.html">懒人排行</a>
			<a href="../../front/view/expressAssist.html">快递助手</a>
		</div>
	</div>

	<div class="userInfoEditCont">
		<div class="userInfoIcon">
			<img src="/front/wximages/userInfoIcon.png" width="100%">
		</div>
		<div class="nickName">用户姓名<p id="userName"></p></div>

		<form>
			<input id="PageContext" type="hidden" value="${pageContext.request.contextPath}" />
			<input id="wxCode" type="hidden" value="${wxCode}" />
			<input type="hidden" id="userId" name="userId" value="${sysWxUser.id}">
			<div class="userInputCont">
				<div class="inputTypeCont">
					<div class="inputTitle">新名称</div>
					<input type="text" class="commonInput" name="name" id="name" placeholder="请输入真实姓名...">
				</div>
				<div class="inputTypeCont">
					<div class="inputTitle">新手机</div>
					<input type="text" class="commonInputFunc userOldPhone" id="usernum" name="usernum" placeholder="请输入新手机号码">
					<div class="commonFuncBtnModify userModifyPhone"></div>
				</div>
				<div class="inputTypeCont">
					<div class="inputTitle">短信</div>
					<input type="text" class="verifiInput" id="verify" name="verify" placeholder="请输入验证码...">
					<input type="button" id="btnSendCode1" class="verifiBtn" onclick="sendMessage1()" value="发送验证码">
				</div>
			</div>
		</form>

		<div class="submitBtn" onclick="update()">修改信息</div>
	</div>
</div>
</body>
<script>
	var phoneReg = /(^1[3|4|5|7|8]\d{9}$)|(^09\d{8}$)/;
	var count = 10;
	var InterValObj1;
	var curCount1;
	$.getJSON("/wx/userName.do",{},function (data) {
		var name = data;
		$("#userName").text(name);
	});
	function sendMessage1() {
		curCount1 = count;
		// 提醒 请输入有效的手机号 可能是变量名不一致
		var phone = $.trim($('#usernum').val());
		if (!phoneReg.test(phone)) {
			alert(" 请输入有效的手机号码");
			return false;
		}

		$("#btnSendCode1").attr("disabled", "true");
		$("#btnSendCode1").val( + curCount1 + "秒再获取");
		InterValObj1 = window.setInterval(SetRemainTime1, 1000);
		//发送短信
		var windowId = layer.load();
		$.getJSON("/wx/loginSms.do",{userPhone:phone},function(data){
			//{status:0/1,result:"成功/失败"}
			layer.close(windowId);
			layer.msg(data.result);
		})

	}
	function SetRemainTime1() {
		if (curCount1 == 0) {
			window.clearInterval(InterValObj1);
			$("#btnSendCode1").removeAttr("disabled");
			$("#btnSendCode1").val("重新发送");
		}
		else {
			curCount1--;
			$("#btnSendCode1").val( + curCount1 + "秒再获取");
		}
	}

	// 修改用户信息
	function update() {
		var newName = $("#name").val();
		var newPhone = $("#usernum").val();
		var verify = $("#verify").val();
		var windowId = layer.load();

		console.log(newName);
		console.log(newPhone);
		console.log(verify);

		// 修改信息
		$.post("/wx/update.do",{newName:newName,newPhone:newPhone,verify:verify},function (data) {
			layer.close(windowId);
			// 出错因为返回值result为null，所以改用data
			// layer.msg(data.data)
			if(data.status === 1){
				//用户登录成功
				layer.msg(data.data)
			}
			layer.msg(data.result);

		},"JSON");
	}

</script>
</html>
